<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<title>医生选择药品</title>
		<link rel="stylesheet" type="text/css" href="css/departmentCss/base.css">
		<link rel="stylesheet" type="text/css" href="css/departmentCss/layout.css">
		<link rel="stylesheet" type="text/css" href="css/departmentCss/zebra_dialog.css">
	    <link rel="stylesheet" type="text/css" href="css/appointmentCss/secondary.css">
	    <link rel="stylesheet" href="css/footer.css">
	<style>
		
		* {
		    margin: 0;
		    padding: 0;
		}
		.select_container{
			width: 100%;
			height: auto;
			
		}
		
		.s_container {
		    height: 70px;
		    width: 500px;
		    /*margin: 100px auto 0 auto;*/
margin: 0 auto;
		}
		
		.parent {
		    position: relative;
		}
		
		.search {
		    width: 300px;
		    height: 40px;
		    border-radius: 18px;
		    outline: none;
		    border: 1px solid #ccc;
		    padding-left: 20px;
		    position: absolute;
		}
		#tbl{
			width: 60%;
			height: 300px;
			border: 1px solid #ccc;	
			/*padding:10px;*/
			margin:0 auto;

		}
		#tbl tr td{
			padding-left: 9px;
		}
		.a{

			height: 70px;
			width: 500px;
			position: relative;
			top: 45px;
			left: 310px;
			/*border: 1px solid red;*/
			font-size: 18px;
		}
		
		.a .btn{
			width: 100px;
			height: 40px;
			background-color: #009688;
			border: none;
			color: white;
			/*padding: 10px 22px;*/
			text-align: center;
			text-decoration: none;
			display: inline-block;
			position: absolute;
			left: 234px;
			top:-17px;
		}
		
		.a .btn:hover {
		    background-color: #4CAF50;
		    color: white;
		}
		
		.a .btn:active {
		  background-color: #3e8e41;
		  box-shadow: 0 4px #666;
		  transform: translateY(4px);
		}
		.b{
			width: 140px;
			height: 60px;
			border: 1px solid black;
			position: absolute;
			top: 550px;
			right: 320px;
			font-size: 18px;
		}
		.select_red{
			font-size: 16px;
			color: red;
		}

	</style>
	<body>
		<div class="header">
	        <div class="wrapper clearfix">
	            <div class="logo">
	                <a id="headBaseConfigWebTitle" href="javascript:void (0)" style="cursor: text;">青山门诊预约挂号</a>
	            </div>
	            <div id="headLoginSituations" class="shop"><a href="login.html">登录</a> | <a href="register.html">注册</a></div>
	        </div>
	    </div>
		<div class="topNav">
	        <div class="wrapper">
	            <div class="topNav_menu">
	                <ul class="clearfix">
	                    <li>
	                        <a id="futureReservation" th:href="@{/department}" >首页</a>
	                    </li>
	                    <li class="last">
	                        <a href="appointment.html">我的中心</a>
	                    </li>
	                </ul>
	            </div>
	        </div>
	    </div>
	    <div class="main">
		    <div class="wrapper clearfix">
		        <p class="mt30 clearfix">
		            <input type="hidden" id="timeType" value="2">
		            <span class="fl"> <a th:href="@{/department}">首页</a>
							&gt; <a href="javascript:void(0)" style="text-decoration: none;cursor: text;"> 选择药品 </a>
						</span>
		        </p>
		    </div>
			<div class="select_container">
				<div class="s_container">
				    <form action="" class="parent">
				        <input type="text" class="search" placeholder="搜索">
				    </form>
				</div>
				<form action="">
					<table id="tbl" border="0"   rules="rows">
						<tr>
							<td>药品名</td>
							<td>药物容量</td>
							<td>制药公司</td>
							<th>数量</th>
							<th>单价</th>
						</tr>
						
						<tr>
						<td>维D钙咀嚼片</td>
						<td>60片</td>
						<td>安士制药（中山）有限公司</td>
						<th>8</th>
						<th>10元</th>
						</tr>
						
						<tr>
						<td>维D钙咀嚼片</td>
						<td>60片</td>
						<td>安士制药（中山）有限公司</td>
						<th>8</th>
						<th>10元</th>
						</tr>
						
						<tr>
						<td>维D钙咀嚼片</td>
						<td>60片</td>
						<td>安士制药（中山）有限公司</td>
						<th>8</th>
						<th>10元</th>
						</tr>
					</table>
				</form>
				<div class="sum_box">
					<div class="a">
					<label>共X条记录，每页显示X条记录</label>
					<button class="btn">确认</button>
				</div>
				
				<div class="b" >
					<li>
						<label for="">数量总计:</label>
						<label for="" class="select_red">3</label>

					</li>
					<li>
						<label for="" >金额总计:</label>
						<label for="" class="select_red">￥100</label>
					</li>
				</div>
				</div>	
				
				
			</div>
			  

		</div>
		<footer class="main-footer">
	        <div class="footer_box">
	            <div class="pull-right hidden-xs">
	                <b>All rights reserved</b>
	            </div>
	            <strong>Copyright &copy; 2021-11 
	                <a href="javascript:void(0)">信工研究院研发部</a>.
	            </strong>  
	        </div>   
    	</footer>
		
	</body>
</html>
